<!DOCTYPE HTML>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:include="admin/head :: head" th:with="title=查询工单">
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <form class="layui-form" id="uploadForm" lay-filter="formfilter">
            <div class="layui-form-item">
                <label class="layui-form-label">标题:</label>
                <div class="layui-input-block">
                    <input class="layui-input" th:value="${m.title}" disabled="disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">工单类型:</label>
                <div class="layui-input-inline">
                    <input class="layui-input" th:value="${m.typeStr}" disabled="disabled">
                </div>
                <label class="layui-form-label">工单状态:</label>
                <div class="layui-input-inline">
                    <input class="layui-input" th:value="${m.statusStr}" disabled="disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">用户:</label>
                <div class="layui-input-inline">
                    <input class="layui-input" th:value="${m.userName}" disabled="disabled">
                </div>
                <label class="layui-form-label">工单号:</label>
                <div class="layui-input-inline">
                    <input class="layui-input" th:value="${m.no}" disabled="disabled">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">手机:</label>
                <div class="layui-input-inline">
                    <input class="layui-input" th:value="${m.phone}" disabled="disabled">
                </div>
                <label class="layui-form-label">邮箱:</label>
                <div class="layui-input-inline">
                    <input class="layui-input" th:value="${m.email}" disabled="disabled">
                </div>
            </div>
            <hr class="layui-bg-black">
            <div th:each="item,itemState:${detailList}" style="margin-top: 20px;">
                <div class="layui-form-item"  >
                    <label class="layui-form-label"  style="width: 150px;" th:text="${'('+item.typeStr+')'+#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}"></label>
                    <div class="layui-input-inline" >
                        <textarea class="layui-textarea"  th:text="${item.content}" disabled="disabled"></textarea>
                    </div>
<!--                    <div class="layui-input-inline" th:if="${item.pic1!=''}"><img width="60" th:src="@{/${item.pic1}}"></div>-->
<!--                    <div class="layui-input-inline" th:if="${item.pic2!=''}"><img width="60" th:src="@{/${item.pic2}}"></div>-->
<!--                    <div class="layui-input-inline" th:if="${item.pic3!=''}"><img width="60" th:src="@{/${item.pic3}}"></div>-->
                    <div>
                        <div style="float: left" th:if="${item.pic1!=''}">
                            <a  th:onclick="'javascript:showImage(\''+${item.pic1}+'\')' ">
                                <img width="60" class="product-thumb" th:src="@{${item.pic1}}"></img>
                            </a>
                        </div>
                        <div style="float: left;margin-left: 50px" th:if="${item.pic2!=''}">
                            <a th:onclick="'javascript:showImage(\''+${item.pic2}+'\')' ">
                                <img width="60" class="product-thumb" th:src="@{${item.pic2}}"></img>
                            </a>
                        </div>
                        <div style="float: left;margin-left: 50px" th:if="${item.pic3!=''}">
                            <a th:onclick="'javascript:showImage(\''+${item.pic3}+'\')' ">
                                <img width="60" class="product-thumb" th:src="@{${item.pic3}}"></img>
                            </a>
                        </div>
                    </div>
                </div>
                <hr>
            </div>
            <hr class="layui-bg-black">
            <div th:if="${m.status!=1}">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span style="color: red">*</span>回复:</label>
                    <div class="layui-input-block">
                        <textarea class="layui-textarea" name="content"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">文件:</label>
                    <div class="layui-input-block">
                        <input type="file" id="file1" name="file1">
                        <input type="file" id="file2" name="file2">
                        <input type="file" id="file3" name="file3">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <input type="hidden" name="workId" th:value="${ m.id}">
                    <button class="layui-btn" lay-submit="" lay-filter="reply">回复</button>
                    <button class="layui-btn" lay-submit="" lay-filter="end">完结(已解决)</button>
                    <button class="layui-btn" lay-submit="" lay-filter="end2">完结(未解决)</button>
                </div>
            </div>
        </form>
    </div>
</div>

<script type="text/javascript" th:inline="javascript">
    layui.use([ 'layer', 'jquery','liuQi'], function () {
        var form = layui.form,
            liuQi = layui.liuQi,
            laydate = layui.laydate;

        form.on('submit(reply)', function (data) {
            if(data.field.content==''){
                parent.layer.msg("请输入回复信息",{icon: 5,time:3000});
                return false;
            }
            var formData = new FormData($('#uploadForm')[0]);
            liuQi.ajaxUpload("/admin/work/reply",formData,'',
                function (data) {
                    //关闭
                    parent.layer.msg(data.msg);
                    parent.layui.table.reload('currentTableId');
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(index);
                }
            );
            return false;
        });
        form.on('submit(end)', function (data) {
            data=data.field;
            data.result=1;
            layer.confirm("是否完结工单(已解决)",function (obj) {
                liuQi.ajax("/admin/work/end",data,
                    function (data) {
                        //关闭
                        parent.layer.msg(data.msg);
                        parent.layui.table.reload('currentTableId');
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    }
                );
            });
            return false;
        });
        form.on('submit(end2)', function (data) {
            data=data.field;
            data.result=0;
            layer.confirm("是否完结工单(未解决)",function (obj) {
                liuQi.ajax("/admin/work/end",data,
                    function (data) {
                        //关闭
                        parent.layer.msg(data.msg);
                        parent.layui.table.reload('currentTableId');
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    }
                );
            });
            return false;
        });

    });


    function showImage(url){
        $("#image",parent.document).attr("src",url);
        $("#showPic",parent.document).show();
    }
</script>
</body>
</html>